<template>
  <UserTableChildren :columns='columns' :cerdatalist='cerdatalist' :pagination='pagination' @onCLickDelete='onCLickDelete' @onClickPagination='onClickPagination' :loading='loading' />
  <div></div>
</template>

<script lang='ts'>
import { reactive, toRefs } from "vue";
import columns from "@/views/UserManage/method/columns";
import UserTableChildren from "@/components/UserModule/ViewModal/children/UserTableChildren/UserTableChildren.vue";
import { select } from "@/api/userApi";
import createStore from "@/store/index";
export default {
  name: " ",
  components: {
    UserTableChildren,
  },
  setup() {
    const data = reactive({
      cerdatalist: [],
      loading: false,
      pagination: {
        total: 0,
        pageSize: 8,
        hideOnSinglePage: true,
        current: 1,
      },
    });

    /* 请求数据 */
    async function request(pageNo = 1) {
      data.loading = true;
      const result = await select({
        pageNo,
        pageSize: data.pagination.pageSize,
        id: createStore.state.userDataList._id,
      });
      if (result.data.data) {
        result.data.data.forEach((element: any) => {
          element.key = element._id;
          element.Bool = true;
        });
        data.cerdatalist = result.data.data;
        data.pagination.total = result.data.total;
      }
      data.loading = false;
    }
    request();

    /* 分页事件 */
    function onClickPagination(current: number) {
      data.pagination.current = current;
      request(current);
    }

    /* 删除 */
    function onCLickDelete(index: number) {
      // data.cerdatalist.splice(index, 1);
      request(data.pagination.current);
    }

    return {
      ...toRefs(data),
      columns,
      onClickPagination,
      onCLickDelete,
    };
  },
};
</script>